.box {
  padding: 0px 10px 20px 20px;
  background: #f0f2f5;
}

.header {
  width: 100%;
  height: 45px;
  position: fixed;
  margin-top: 0px;
  line-height: 40px;
  background: #f0f2f5;
  /* margin-bottom: 50px; */
}

.header > button {
  height: 26px;
  line-height: 0px;
  font-size: 14px;
  margin-left: 20px;
  /* background: #e9f4ff; */
  border-radius: 3px;
  /* border: 1px solid #c2cede; */
  padding: 11px 20px;
  border: 1px solid;
  border-color: #c0ccdd !important;
  background: #eaf2ff !important;
  background-image: linear-gradient(#f9fdff, #e9f4ff, #f9fdff) !important;
  color: #001529 !important;
}

.header > button:hover {
  background-image: linear-gradient(#b2ddff, #7bbdff, #b2ddff) !important;
}

.container {
  width: 100%;
  background-color: #fff;
  padding: 10px 10px;
  border: 1px solid #fff;
}

/* 部门页面 */
.boxs {
  padding: 10px 0px 0px 0px;
  background: #f0f2f5;
}

.boxs > header {
  width: 100%;
  height: 35px;
  background: #f0f2f5;
}

/* 部门页面布局 */
.containers {
  width: 100%;
  height: calc(100vh - 45px - 100px);
  background-color: #fff;
  border: 1px solid #fff;
  display: flex;
}

.left {
  flex: 1;
  border-right: 1px solid #5377b6;
}

.right {
  flex: 4.5;
  border-left: 1px solid #5377b6;
}

.right i {
  color: red;
}

.container > header {
  height: 60px;
}

.container > header > h1 {
  width: 100%;
  text-align: center;
}

/* 第一个表格样式,样式相同也有第二个表格内容 */
.tables {
  border: 1px solid #c0ccdd;
  width: 100%;
}

/* 第二个表格样式 */
.table2 {
  border: 1px solid #c0ccdd;
  width: 100%;
  margin-top: 15px;
}

.table3 {
  border: 1px solid #c0ccdd;
  width: 100%;
  margin-top: 15px;
}

.table3 > tbody {
  text-align: center;
}

.tables > thead > tr > td,
.tables > tbody > tr > td,
.table2 > thead > tr > td,
.table2 > tbody > tr > td,
.table3 > thead > tr > td,
.table3 > tbody > tr > td {
  border: 1px solid #c0ccdd;
}

.tables > thead > tr,
.table2 > thead > tr,
.table3 > thead > tr {
  height: 40px;
  line-height: 40px;
  font-size: 17px;
  background-image: linear-gradient(#e6eefb, #f6fbff);
}

.tables > thead > tr > td,
.table2 > thead > tr > td,
.table3 > thead > tr > td {
  padding-left: 20px;
  letter-spacing: 2px;
}

.tables > tbody > tr,
.table2 > tbody > tr,
.table3 > tbody > tr {
  height: 43px;
}

.tables > tbody > tr > td:nth-child(1),
.tables > tbody > tr > td:nth-child(3),
.tables > tbody > tr > td:nth-child(5),
.table2 > tbody > tr > td:nth-child(1),
.table2 > tbody > tr > td:nth-child(3),
.table2 > tbody > tr > td:nth-child(5) {
  width: 9%;
  color: black;
  text-align: right;
  letter-spacing: 2px;
  background: #f9fcff;
}

.tables > tbody > tr > td:nth-child(2),
.tables > tbody > tr > td:nth-child(4),
.tables > tbody > tr > td:nth-child(6),
.table2 > tbody > tr > td:nth-child(2),
.table2 > tbody > tr > td:nth-child(4),
.table2 > tbody > tr > td:nth-child(6) {
  width: 22%;
  color: #545454;
  padding-left: 12px;
  letter-spacing: 1px;
}

/* 第一个表格微调 */
.tables > tbody > tr > td:nth-child(6) img {
  width: 65%;
}

.tables > tbody > tr > td:nth-child(5) {
  text-align: left;
}

/* 第三个表格微调 */

.table3 > thead > tr > td button {
  width: 60px;
  height: 30px;
  line-height: 25px;
  font-size: 15px;
  margin-left: 20px;
  background: #e9f4ff;
  border-radius: 3px;
  margin-top: 7px;
  border: 1px solid #c2cede;
}

.table3 > tbody > tr > td:nth-child(1) {
  width: 5%;
}

/* 主页面 */
.main {
  width: 100%;
}

/* 草稿箱页面 */
.draft {
  width: 100%;
  height: calc(100vh - 80px);
}

.draft header {
  height: 45px;
  border-bottom: 1px solid #c2cede;
}

.draft header button {
  width: 60px;
  height: 30px;
  line-height: 25px;
  font-size: 15px;
  margin-left: 20px;
  background: #e9f4ff;
  border-radius: 3px;
  margin-top: 7px;
  border: 1px solid #c2cede;
}

.draft table {
  width: 100%;
  border: 1px solid #c2cede;
}

.draft > table > thead > tr {
  height: 40px;
  line-height: 40px;
  font-size: 15px;
  background-image: linear-gradient(#e6eefb, #f6fbff);
}

.draft > table > thead > tr > td {
  width: 40px;
  border: 1px solid #c2cede;
}
